<script setup lang="ts">
import { useAdminEmailStore } from '../store/adminEmail'
import EmailSet from './EmailSet.vue'
import { storeToRefs } from 'pinia'
import { onMounted } from 'vue'

const store = useAdminEmailStore()
const { saveConfig, getConfig } = store
const { loading, contentLoading } = storeToRefs(store)
onMounted(async () => {
  await getConfig()
  contentLoading.value = false
})
</script>

<template>
  <t-row v-if="!contentLoading">
    <t-card class="card" header-bordered title="邮件设置" style="width: 100%">
      <template #actions>
        <t-button size="small" @click="saveConfig" :loading="loading">保存</t-button>
      </template>
      <t-row class="main">
        <EmailSet />
      </t-row>
    </t-card>
  </t-row>
</template>

<style scoped lang="less">
.t-row {
  margin: 20px 0;

  .main {
    border: var(--td-component-border) 1px solid;
    margin: 20px;
    box-sizing: border-box;
  }
}
</style>
